require(['./config'], () => {
    require(['request', 'template', 'header', 'footer','zoom'], (req, template) => {
        class Detail {
            constructor() {
                this.getProdId()
                this.prodList = []
            }
            getProdId() {
                const str = window.location.search.split('=')[1]
                this.getData(str)
            }
            // 发送请求
            getData(prodId) {
                req.getDetailsData(prodId)
                    .then(res => {
                        if (res.code === 200) {
                            console.log(res)
                            const { detail } = res.data
                            this.renderHtml(detail)
                        }
                    })
            }
            // 渲染页面
            renderHtml(res) {
                const { descContentList, id, photo, title, price, saleNum } = res
                $('main').html(template('prodDetailTemplate', { descContentList, id, photo, title, price, saleNum }))
                this.initzoom()
                this.addToCart({ id, photo, title, price, saleNum })
            }
            initzoom() {
                $(".zoom-image").elevateZoom({
                    gallery: 'thumbslist'
                })
            }
            addToCart(prodInfo) {
                 const { id, photo, title, price, saleNum } = prodInfo
                $('.add-basket').click(() => {
                     let prodList = localStorage.getItem('prodList')
                     console.log(prodList)
                     if (prodList) {
                        prodList = JSON.parse(prodList)
                        const flag = prodList.some(item => {
                            return item.id === id
                         })
                        if(flag){
                            prodList.forEach(item => {
                                item.id === id ? item.count++ : ''                            
                            })
                         }else{
                             prodList.push({
                                id, 
                                imgSrc: photo[0].url, 
                                title, 
                                price, 
                                saleNum, 
                                count: $('.txt-amount').val() - 0
                             })
                         }
                         localStorage.setItem('prodList', JSON.stringify(prodList))

                     } else {
                        const arr = [{ id, imgSrc: photo[0].url, title, price, saleNum, count: $('.txt-amount').val() - 0 }]
                        localStorage.setItem('prodList', JSON.stringify(arr))
                    }

                    $('.tip').fadeIn(500,() => {
                        setTimeout(() => {
                            $('.tip').fadeOut(500)
                        },500)
                    })
                })
            }
        }
        return new Detail()
    })
})